<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Trang thanh toán</title>
<link rel="stylesheet" type="text/css" href="css/payment.css">
<link rel="stylesheet" type="text/css" href="css/form_new.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"> </script>
<script src="scripts/jcarousellite_1.js"> </script>
<script src="scripts/qtip/jquery.qtip-1.0.0-rc3.js"> </script>

<link rel="stylesheet" type="text/css" href="scripts/facebox/src/facebox.css" />
<script language="javascript" src="scripts/facebox/src/facebox.js"></script>

</head>
<body>

<?php 
    $step=1;
?>

<div id="page">
    <div class="layout-main-shortcuts">
        <div class="logo"></div>
        <div class="support_online"><a href="#">Hỗ trợ trực tuyến</a></div>
    </div>
    <div class="main_page">
        <div class="text_payment_online">Thanh toán trực tuyến với Bảo Kim đảm bảo</div>
        <div class="table_payment">
            <div class="border_top"></div>
            <div class="center_table_payment">
            
                <div class="border_left"></div>
                
                <div class="payment_area">
                    <div class="left_col">
                    
                     <?php include('common.php');?>
                       
                       <?php 
                       if($step==1){
                            include('step_1/index.php');    
                       }
                       if($step==2){
                           include('step_2/index.php');    
                       }
                       if($step==3){
                           include('step_3/index.php');    
                       }
                       ?>
                       
                    </div>
                    
                    <div class="right_col">
                        <div class="bk_certificate"></div>
                        
                        <?php 
                       if($step==1){
                            include('step_1/display_step.php');    
                       }
                       if($step==2){
                           include('step_2/display_step.php');    
                       }
                       if($step==3){
                           include('step_3/display_step.php');    
                       }
                       ?>
                        
                      
                    </div>
                    
                </div>
                
                <div class="border_right"></div>  
               
            </div>
            <div class="border_bottom"></div>
        </div>
    </div>
</div>
  
</body>
</html>

<script type="text/javascript">
  $(function() {
    $(".anyClass").jCarouselLite({
        btnNext: ".next_2",
        btnPrev: ".prev",
        visible: 4,
    });
    
    $("button.next_2").click(function(){
        $("button.prev").show();
        $("button.next_2").hide();
//        $(".li_mobile_scratch_cards").css("border-left","1px solid #cdcdcd");
        $("#offline_payment").css('border-right','none');
        
//        $(".li_offline_payment").css('border-right','none');
//        $(".li_offline_payment").css('width','152px');
//        
//        $(".li_using_baokim_account").css('border-left','none');
    });
    
    $("button.prev").click(function(){
        $("button.next_2").show();
        $("button.prev").hide();
        $(".li_mobile_scratch_cards").css("border-left","none");
        $("#offline_payment").css('border-right','1px solid #cdcdcd');
        
//        $(".li_offline_payment").css('width','151px');
//        $(".li_using_baokim_account").css('border-left','1px #cdcdcd solid');
    });
    $(".methods_payment ul li").click(function(){
        $(".methods_payment ul li").removeClass('selected');
        $(this).addClass('selected');
        
        var val=$(this).attr('val');
        if(val!=='using_baokim_account'){
            $(".selected").css("border-left",'none');
        }
        
        $("#using_baokim_account").hide();
        $("#mobile_scratch_cards").hide();
        $("#international_credit_cards").hide();
        $("#banks_dosmestic").hide();
        $("#offline_payment").hide();
        
        $("#"+val+"").show();
        
    })  ;
    
    $(document).ready(function() {
        $('a[rel*=facebox]').facebox();
    })
    
  }); 
    
</script>  
